<!doctype html>
<html lang="cn">
<head>
    <meta charset="UTF-8">
    <meta name="viewport"
          content="width=device-width, user-scalable=no, initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0">
    <meta http-equiv="X-UA-Compatible" content="ie=edge">
    <title>每日签约推送-手动版</title>
    <script src="https://cdn.bootcss.com/jquery/3.4.0/jquery.min.js"></script>

    <style>
        html, body {
            margin: 0;
            padding: 0;
            font-family: "Microsoft YaHei";
        }

        .wrap-dialog {
            position: fixed;
            top: 0;
            left: 0;
            width: 100%;
            height: 100%;
            font-size: 16px;
            text-align: center;
            background-color: rgba(0, 0, 0, .4);
            z-index: 999;
        }

        .dialog {
            position: relative;
            margin: 15% auto;
            width: 300px;
            background-color: #FFFFFF;
        }

        .dialog .dialog-header {
            height: 20px;
            padding: 10px;
            background-color: lightskyblue;
        }

        .dialog .dialog-body {
            height: 30px;
            padding: 20px;
        }

        .dialog .dialog-footer {
            padding: 8px;
            background-color: whitesmoke;
        }

        .btn {
            width: 100px;
            padding: 2px;
        }

        .hide {
            display: none;
        }

        .ml50 {
            margin-left: 50px;
        }
    </style>
</head>

<body>
<h1>手动推送每日签约</h1>
<div>
    <div>
        更新开店数据至观远(请不要重复点击) :
        <button id="updateGy">更新</button>
    </div>
    <hr>
    <br>
    推送时间: <input type="date" name="" id="date" value="@php echo date('Y-m-d'); @endphp">
    <br>
    <br>
    推送环境 <label>
        <select id="env">
            <option value="qa">测试</option>
            <option value="prod">生产</option>
        </select>
    </label>

    <button id="push">推送</button>

    <div class="wrap-dialog hide">
        <div class="dialog">
            <div class="dialog-header">
                <span class="dialog-title">提示</span>
            </div>
            <div class="dialog-body">
                <span class="dialog-message">你确认发送消息？</span>
            </div>
            <div class="dialog-footer">
                <input type="button" class="btn" id="confirm" value="确认"/>
                <input type="button" class="btn ml50" id="cancel" value="取消"/>
            </div>
        </div>
    </div>

    <script>
        $(function () {
            $('#updateGy').on('click', (function () {
                $(this).html('更新中...等待更新成功通知(1分钟左右)');
                $.post('./updateNewSignDaily', function () {
                    alert('更新成功')
                });
                $('#updateGy').off('click');
            }));


            $('#push').click(function () {
                let $env = $('#env option:selected').val();
                let $envTitle = $('#env option:selected').text();
                let $day = $('#date').val();
                var message = "你确认要在 「" + $envTitle + "」环境推送消息吗？";
                dialogBox(message,
                    function () {
                        $.post('', {env: $env, day: $day});
                    }
                );
            });

            function dialogBox(message, yesCallback, noCallback) {
                yesFuc = yesCallback
                noFuc = noCallback
                if (message) {
                    $('.dialog-message').html(message);
                }
                // 显示遮罩和对话框
                $('.wrap-dialog').removeClass("hide");
                // 确定按钮


            }

            $('#confirm').click(function () {
                $('.wrap-dialog').addClass("hide");
                yesFuc();
            });

            // 取消按钮
            $('#cancel').click(function () {
                $('.wrap-dialog').addClass("hide");
                noFuc();
            });

        });
    </script>
</div>
</body>
</html>
